<template>
  <div id="todo_input" class="input-group " v-bind:class="{'has-error': hasError}">
    <input type="text" class="form-control" placeholder="请输入代办任务事项。。" ref="txttodo" v-model.trim="content">
    <span class="input-group-btn">
      <button class="btn btn-info" v-on:click="handleAddTodo">添加任务</button>
    </span>
  </div>
</template>

<script>
export default {
  name: 'todo_input',
  props: ['hasError'],
  data() {
    return {
      content: ''
    }
  },
  mounted() {
    this.$refs.txttodo.focus();
  },
  methods: {
    handleAddTodo() {
      this.$emit('on-add-todo', this.content)
      this.content = ''
    }
  }
}
</script>

